<!--万能表单模块-->
<template>
    <el-form v-model="form_data" ref="search_from" label-width="100px" :rules="form_rule">
        <#list columns as column>
        <el-form-item label="${column.columnComment}" prop="${column.camelName}" for="${column.camelName}">
            <el-input size="small" v-model="form_data.${column.camelName}" id="${column.camelName}"></el-input>
        </el-form-item>
        </#list>

        <div class="pull-right">
            <el-button size="small" @click="resetForm">重置</el-button>
            <el-button size="small" type="primary" @click="submitForm">提交</el-button>
        </div>
    </el-form>
</template>

<script>


    export default {
        components: {},
        data() {
            return {
                form_data: {
                    _a: ''
                    <#list columns as column>
                    , ${column.camelName}: ''
                    </#list>
                },
                form_rule: {
                    _a: []
                    <#list columns as column>
                    <#if "String"==column.javaType>
                    , ${column.camelName}: [
                        {required: true, message: '[${column.columnComment}]字段不允许为空 ', trigger: 'blur'},
                        {min: 0, max: 5, message: '最多${column.length}字符', trigger: 'blur'}
                    ]
                    </#if>
                    </#list>
                }
            }
        },
        methods: {
            /**
             * submit form
             */
            submitForm: function () {
                this.$refs.search_from.validate((valid) => {
                    if (valid) {
                        console.log(this.form_data);
                    } else {
                        console.log('invalidate form!');
                    }
                });
            },

            /**
             * reset form
             */
            resetForm: function () {
                this.$refs.search_from.resetFields();
            },


            /**
             * input change event
             */
            onchange: function (val) {
                console.log(val);
            }
        }
    }
</script>
